import React, { useEffect, useState } from 'react'
import { history } from 'umi'
import { Tabbar } from 'react-vant'
import {ContentOutline,UnorderedListOutline,UserOutline} from 'antd-mobile-icons'


export default function Footer() {
  const [name, setName] = useState(localStorage.path || '/goods')
  useEffect(() => {
    if (history.location.pathname == '/goods') {
      setName('/goods')
      localStorage.path = '/goods'
    }
  }, [])
  const handleUrl = (ev) => {
    setName(ev)
    history.push(ev)
    localStorage.path = ev
  }
  return (
     
      <Tabbar value={name} onChange={handleUrl} iconPrefix="img" placeholder fixed zIndex safeAreaInsetBottom>
      <Tabbar.Item name='/goods' icon={<ContentOutline/>}>
        首页
      </Tabbar.Item>
      <Tabbar.Item name='/question' icon={<UnorderedListOutline />}>
        题库
      </Tabbar.Item>
      <Tabbar.Item name='/my' icon={<UserOutline />}>
        我的
      </Tabbar.Item>
    </Tabbar>
   
    
  )
}
